
<template>
  <Card class="card_style" :bordered="false" :dis-hover="true">
    <Row class="bench_search">
      <Col span="6" offset="1">
        <span>标题：</span>
        <Input style="width: 70%;" v-model="searchInfo.title" />
      </Col>
      <Col span="6" offset="1">
        <span>材料编码：</span>
        <Input style="width: 70%;" v-model="searchInfo.codename" />
      </Col>
      <Button class="new-btn-sty" @click="searchData" style="margin-right:10px"><Icon type="ios-search" /> 搜索</Button>
    </Row>
    <Table border :columns="columns1" :data="datalist"></Table>
    <Row v-if="loadData == true">
      <Col class="demo-spin-col" span="8" offset="8">
        <Spin fix>
          <Icon type="ios-loading" size=18 class="demo-spin-icon-load"></Icon>
          <div>数据正在加载</div>
        </Spin>
      </Col>
    </Row>
  </Card>
</template>

<script>
import { loadelectronicmaterialstemplateList } from '@/api/eventlist'

export default {
  name: 'message',
  data () {
    return {
      loadData: true,
      searchInfo: { title: '', codename: '' },
      paramData: {},
      columns1: [
        { title: '序号', type: 'index', width: 70, align: 'center' },
        { title: '标题', key: 'title', width: 300, align: 'center' },
        { title: '内容', key: 'content', width: 300, align: 'center' },
        { title: '材料标签', key: 'labelname', width: 250, align: 'center' },
        { title: '材料编码', key: 'codename', width: 250, align: 'center' },
        { title: '创建时间', key: 'create_time', width: 200, align: 'center' }
      ],
      datalist: []
    }
  },
  methods: {
    // 查询订单列表接口
    init (param) {
      loadelectronicmaterialstemplateList(param).then(res => {
        if (res.data.errcode === 0) {
          this.datalist = res.data.data
          this.loadData = false
        } else {
          this.loadData = true
          this.$Notice.error({ title: '获取电子材料模板列表失败', desc: res.data.errmsg })
        }
      })
    },
    searchData () {
      let params = {
        codename: this.searchInfo.codename,
        title: this.searchInfo.title
      }
      this.init(params)
    }
  },
  mounted () {
    this.init(this.params)
  }
}
</script>
